<nz-modal [(nzVisible)]="isVisible" [nzWidth]="modalWidth" (nzOnCancel)="onBack()" [nzStyle]="{'top': '50px'}">
  <div *nzModalTitle>{{ title }}</div>
  <ng-container *nzModalContent>
    <div class="candidate-view-all-container">
      <nz-card nzTitle="招聘岗位信息">
        <form [formGroup]="applicationRecordForm">
          <nz-row [nzGutter]="10">
            <nz-col [nzSpan]="12">
              <nz-form-item>
                <nz-form-label [nzSpan]="6" nzFor="enterpriseName">企业名称</nz-form-label>
                <nz-form-control>
                  <input nz-input formControlName="enterpriseName" />
                </nz-form-control>
              </nz-form-item>
            </nz-col>
            <nz-col [nzSpan]="12">
              <nz-form-item>
                <nz-form-label [nzSpan]="6" nzFor="jobDescriptionName">招聘岗位名称</nz-form-label>
                <nz-form-control>
                  <input nz-input formControlName="jobDescriptionName" />
                </nz-form-control>
              </nz-form-item>
            </nz-col>
          </nz-row>
        </form>
      </nz-card>
      <nz-card nzTitle="基本信息">
        <form [formGroup]="candidateForm">
          <nz-row [nzGutter]="10">
            <nz-col [nzSpan]="12">
              <nz-form-item>
                <nz-form-label [nzSpan]="6" nzFor="username">用户名</nz-form-label>
                <nz-form-control>
                  <input nz-input formControlName="username" />
                </nz-form-control>
              </nz-form-item>
            </nz-col>
            <nz-col [nzSpan]="12">
              <nz-form-item>
                <nz-form-label [nzSpan]="6" nzFor="name">姓名</nz-form-label>
                <nz-form-control>
                  <input nz-input formControlName="name" />
                </nz-form-control>
              </nz-form-item>
            </nz-col>
          </nz-row>
          <nz-row [nzGutter]="10">
            <nz-col [nzSpan]="12">
              <nz-form-item>
                <nz-form-label [nzSpan]="6" nzFor="password">密码</nz-form-label>
                <nz-form-control>
                  <input nz-input formControlName="password" />
                </nz-form-control>
              </nz-form-item>
            </nz-col>
            <nz-col [nzSpan]="12">
              <nz-form-item>
                <nz-form-label [nzSpan]="6" nzFor="gender">性别</nz-form-label>
                <nz-form-control>
                  <nz-select formControlName="gender">
                    <nz-option nzLabel="男" [nzValue]="1"></nz-option>
                    <nz-option nzLabel="女" [nzValue]="2"></nz-option>
                  </nz-select>
                </nz-form-control>
              </nz-form-item>
            </nz-col>
          </nz-row>
          <nz-row [nzGutter]="10">
            <nz-col [nzSpan]="12">
              <nz-form-item>
                <nz-form-label [nzSpan]="6" nzFor="birthDate">出生日期</nz-form-label>
                <nz-form-control>
                  <input nz-input formControlName="birthDate" />
                </nz-form-control>
              </nz-form-item>
            </nz-col>
            <nz-col [nzSpan]="12">
              <nz-form-item>
                <nz-form-label [nzSpan]="6" nzFor="contactPhone">联系电话</nz-form-label>
                <nz-form-control>
                  <input nz-input formControlName="contactPhone" />
                </nz-form-control>
              </nz-form-item>
            </nz-col>
          </nz-row>
          <nz-row [nzGutter]="10">
            <nz-col [nzSpan]="12">
              <nz-form-item>
                <nz-form-label [nzSpan]="6" nzFor="email">邮箱</nz-form-label>
                <nz-form-control>
                  <input nz-input formControlName="email" />
                </nz-form-control>
              </nz-form-item>
            </nz-col>
            <nz-col [nzSpan]="12">
              <nz-form-item>
                <nz-form-label [nzSpan]="6" nzFor="area">省/市/区</nz-form-label>
                <nz-form-control>
                  <nz-cascader [nzOptions]="provinceCityAreaOptions" formControlName="provinceCityArea"
                              nzValueProperty="code" nzLabelProperty="name"></nz-cascader>
                </nz-form-control>
              </nz-form-item>
            </nz-col>
          </nz-row>
          <nz-row [nzGutter]="10">
            <nz-col [nzSpan]="12">
              <nz-form-item>
                <nz-form-label [nzSpan]="6" nzFor="address">家庭地址</nz-form-label>
                <nz-form-control>
                  <input nz-input formControlName="address" />
                </nz-form-control>
              </nz-form-item>
            </nz-col>
          </nz-row>
        </form>
      </nz-card>
      <nz-card nzTitle="教育经历">
        <nz-table #educationTable [nzData]="listOfEducation" [nzTotal]="totalOfEducation" nzSize="small" nzShowPagination="false">
          <thead>
            <tr>
              <th>应聘者姓名</th>
              <th>学校名称</th>
              <th>学历</th>
              <th>开始日期</th>
              <th>结束日期</th>
            </tr>
          </thead>
          <tbody>
            <tr *ngFor="let data of educationTable.data">
              <td>{{data.candidateName}}</td>
              <td>{{data.schoolName}}</td>
              <td>
                <ng-container *ngIf="data.degree === 10">初中</ng-container>
                <ng-container *ngIf="data.degree === 20">高中</ng-container>
                <ng-container *ngIf="data.degree === 30">本科</ng-container>
                <ng-container *ngIf="data.degree === 40">硕士研究生</ng-container>
                <ng-container *ngIf="data.degree === 50">博士研究生</ng-container>
              </td>
              <td>{{data.startDate}}</td>
              <td>{{data.endDate}}</td>
            </tr>
          </tbody>
        </nz-table>
      </nz-card>
      <nz-card nzTitle="工作经历">
        <nz-table #workExperienceTable [nzData]="listOfWorkExperience" [nzTotal]="totalOfWorkExperience" nzSize="small" nzShowPagination="false">
          <thead>
            <tr>
              <th>应聘者姓名</th>
              <th>公司名称</th>
              <th>岗位</th>
              <th>开始日期</th>
              <th>结束日期</th>
              <th>岗位职责</th>
            </tr>
          </thead>
          <tbody>
            <tr *ngFor="let data of workExperienceTable.data">
              <td>{{data.candidateName}}</td>
              <td>{{data.company}}</td>
              <td>{{data.position}}</td>
              <td>{{data.startDate}}</td>
              <td>{{data.endDate}}</td>
              <td class="ellipsis">{{data.responsibilities}}</td>
            </tr>
          </tbody>
        </nz-table>
      </nz-card>
      <nz-card nzTitle="技能证书">
        <nz-table #skillCertificateTable [nzData]="listOfSkillCertificate" [nzTotal]="totalOfSkillCertificate" nzSize="small" nzShowPagination="false">
          <thead>
            <tr>
              <th>应聘者姓名</th>
              <th>证书名称</th>
              <th>颁发机构</th>
              <th>颁发时间</th>
              <th>到期日期</th>
            </tr>
          </thead>
          <tbody>
            <tr *ngFor="let data of skillCertificateTable.data">
              <td>{{data.candidateName}}</td>
              <td>{{data.certificateName}}</td>
              <td>{{data.issuingAuthority}}</td>
              <td>{{data.issueDate}}</td>
              <td>{{data.expiryDate}}</td>
            </tr>
          </tbody>
        </nz-table>
      </nz-card>
      <nz-card nzTitle="培训记录">
        <nz-table #trainingRecordTable [nzData]="listOfTrainingRecord" [nzTotal]="totalOfTrainingRecord" nzSize="small" nzShowPagination="false">
          <thead>
            <tr>
              <th>应聘者姓名</th>
              <th>培训名称</th>
              <th>培训日期</th>
              <th>培训时长</th>
              <th>培训供应商</th>
              <th>培训内容</th>
            </tr>
          </thead>
          <tbody>
            <tr *ngFor="let data of trainingRecordTable.data">
              <td>{{data.candidateName}}</td>
              <td>{{data.trainingName}}</td>
              <td>{{data.trainingDate}}</td>
              <td>{{data.durationHours}}</td>
              <td>{{data.provider}}</td>
              <td class="ellipsis">{{data.trainingDescription}}</td>
            </tr>
          </tbody>
        </nz-table>
      </nz-card>
    </div>
  </ng-container>
  <div *nzModalFooter>
    <div class="form-button-container">
      <button nz-button nzType="default" (click)="onBack()">关闭</button>
    </div>
  </div>
</nz-modal>